<template>
<div>
	<el-card>
		<el-button type="primary" @click="open">
			<i class="el-icon-plus"></i>
			添加商品
		</el-button>
		<div style="margin-top: 20px;"></div>

		<el-table v-loading="loading" :data="list.data" height="600" border>
			<el-table-column prop="time" label="日期">
				<template slot-scope="scop">
					{{$formatDate(scop.row.time)}}
				</template>
			</el-table-column>
			<el-table-column prop="name" label="名称">
			</el-table-column>
			<el-table-column prop="price" label="现价">
			</el-table-column>
			<el-table-column prop="oldprice" label="市场价">
			</el-table-column>
			<el-table-column label="分类">
				<template slot-scope="scop">
					{{$getClassify(scop.row.classify)}}
				</template>
			</el-table-column>
			<el-table-column label="图片">
				<template slot-scope="scop">
					<div v-for="(item,index) in  scop.row.images" v-if="index==0">
						<el-image style="width: 50px; height: 50px" :src="$linkUrl(item)" fit="fit">
						</el-image>
					</div>
				</template>
			</el-table-column>
			<el-table-column label="上线 " width="100">
				<template slot-scope="scop">
					<el-switch v-model="scop.row.show" :active-value="1" :inactive-value="0"
						@change="changeShow(scop.row.show,scop.row.id)"></el-switch>
				</template>
			</el-table-column>
			<el-table-column label="热门 " width="100">
				<template slot-scope="scop">
					<el-switch v-model="scop.row.top" :active-value="1" :inactive-value="0"
						@change="changeTop(scop.row.top,scop.row.id)"></el-switch>
				</template>
			</el-table-column>
			<el-table-column fixed="right" label="操作" width="150">
				<template slot-scope="scope">
					<el-button @click="edit(scope.row)" size="small" type="primary">
						<i class="el-icon-edit"></i>
					</el-button>
					<el-popconfirm title="确定删除吗？" @confirm="delActivity(scope.row)">
						<el-button slot="reference" size="small" type="danger">
							<i class="el-icon-delete"></i>
						</el-button>
					</el-popconfirm>
				</template>
			</el-table-column>
		</el-table>
		<div style="margin-top: 20px;"></div>
		<Pagination :total="list.total " @SizeChange='SizeChange' @CurrentChange='CurrentChange' />
	</el-card>
</div>
</template>

<script>
	import Pagination from '@/components/pagination';
	export default {
		components: {

			Pagination
		},
		data() {
			return {
				list: [],
				size: 10,
				page: 1,
				loading: true
			};
		},


		created() {
			this.jiazai()
		},
		methods: {
			changeTop(e, id) {
				this.axios.post("/admin/user/topOrdinarymall", {
					id: id,
					top: e
				}).then(res => {

				}).catch(error => {})
			},
			changeShow(e, id) {
				this.axios.post("/admin/user/upOrdinarymall", {
					id: id,
					show: e
				}).then(res => {

				}).catch(error => {})
			},
			delActivity(e) {
				this.axios.post("/admin/user/delOrdinarymall", {
					id: e.id
				}).then(res => {
					this.$message.success({
						message: "删除成功",
						onClose: (res) => {
							location.reload()
						}
					})
				}).catch(error => {})
			},
			SizeChange(e) {
				this.size = e.size;
				this.page = e.page;
				this.jiazai()
			},
			CurrentChange(e) {
				this.size = e.size;
				this.page = e.page;
				this.jiazai()
			},
			open() {
				// this.$refs.chilrenAdd.dialogVisible = true;
				// this.$refs.chilrenAdd.form = {};
				// this.$forceUpdate()
				this.$router.push("/addMall")
			},
			edit(e) {
				this.$router.push("/addMall?id=" + e.id)
			},
			jiazai() {
				this.axios.post("/api/index/findOrdinaryMall", {
					page: this.page,
					size: this.size,
				}).then(res => {
					this.list = res;
					this.loading = false;
				}).catch(error => {

				})
			},

		}
	};
</script>


<style>


</style>
